<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="Doc.css" rel="stylesheet"/>
<title>TreeGrid - Type Html</title>
</head>
<body>
<div class="Doc">


<h1>HTML and special types</h1>
<p>TreeGrid documentation</p>

<!-----------------------------------------------------------------------  Html type  ------------------------------------------------->
<a name="Html"></a><a name="THtml"></a>
<h2>Html type</h2>

Html type show in cell any HTML code as is without any change.<br />
<i>The HTML code must be fully valid. TreeGrid does not check the HTML code validity, the invalid HTML code can break down the whole grid layout!</i><br />

<a name="XML"></a>
<h4>HTML code in XML</h4>
To put HTML code into XML, you need to escape the '&lt;' and '&amp;' entities by <b>&amp;lt;</b> and <b>&amp;amp;</b> and if placed to XML attribute value also the '<b>"</b>' must be replaced by <b>&amp;quot;</b><br />
If you include the XML data directly into HTML page, you have to escape the entities twice: '&lt;' by <b>&amp;amp;lt;</b> and '&amp;'&nbsp;by <b>&amp;amp;amp;</b> and '<b>"</b>' by <b>&amp;amp;quot;</b><br />

<a name="Link"></a>
<h4>Anchor links (&lt;a href>)</h4>
<i>Since 15.0</i> clicks to the <b>&lt;a href></b> links in the html code are handled the same as the <a href="CellBasics.htm#CellLink">Link</a> attribute.<br />
The links use the cell <a href="CellBasics.htm#CLinkBase">LinkBase</a> and <a href="CellBasics.htm#CLinkTarget">LinkTarget</a> attributes and can be handles by the <a href="CellBasics.htm#CellLink">Link actions</a>.<br />

<a name="Edit"></a>
<h4>Editing HTML</h4>
The Html type is <u>not</u> editable by default. 
The editing must be explicitly permitted by <b>CanEdit="1"</b> for the cell or column or by <a href="#CfgEditHtml">EditHtml</a>.<br />
The Html type can be edited as plain text or plain HTML code according to <a href="#CfgEditHtml">EditHtml</a> value.<br />

<!-- Type -->
<a name="CTypeHtml"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "Html"</tt></s>
</div>
To define Html type, set column or cell attribute Type to "<b>Html</b>".<br />

<!-- EmptyValue -->
<a name="CEmptyValue"></a>
<div class="XML">
   <u>new <b>6.3</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>EmptyValue</h4> <s>[""]</s>
</div>
The HTML string displayed when the value is empty.<br />
Usable especially for <b>Select</b> type or if used <tt>Button='Defaults'</tt> with <tt>Range='1'</tt>.<br />

<!-- Format -->
<a name="CFormat"></a>
<div class="XML">
   <u>new <b>9.2</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
JSON named array of display values for particular cell values. All other cell values are displayed unchanged.<br />
The items can contain HTML code. The names are case sensitive.<br />
For example if <tt>&lt;C Type="Html" Format = '{One:"Red", Two:"Green", Three:"&lt;b>blue&lt;/b>"}'/></tt> and the cell value is Two, it displays Green, if the cell value is Four, it displays Four.<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- EditFormat -->
<a name="CEditFormat"></a>
<div class="XML">
   <u>new <b>9.2</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>EditFormat</h4> <s></s>
</div>
Specifies format for editing - how the text will be modified for edit and the edited value back to data. For Html type is used especially for Defaults dialog to have name/key pairs.<br />
JSON named array of input values for particular cell values. Format must start by '{'. All other cell values are edited unchanged. The items must not contain HTML code. The names are case sensitive.<br />
For example if <tt>&lt;C Type="Html" EditFormat = '{1:"one", 2:"two", 3:"three"}'/></tt> and cell has value 2, the value for input will be two. If entered 'three', the cell value will be 3, if entered 'four', the cell value will be 'four'.<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- EditHtml -->
<a name="CfgEditHtml"></a>
<div class="XML">
   <u>new <b>13.0</b></u> <b>&lt;Cfg></b> <i>int</i>
   <h4>EditHtml</h4> <s>[0]</s>     
</div>
If and how the Html Type cell will be edited. <i>For Html edited by HTML editor use <a href="EHtml">EHtml</a> type instead.</i><br />
<b>0</b> - As Html and only if the cell has explicitly set <a href="CellEdit.htm#CCanEdit">CanEdit</a>='1'.<br />
<b>1</b> - As Html always except if the <a href="CellEdit.htm#CCanEdit">CanEdit</a> attribute is set to '0'.<br />
<b>2</b> - As Text always except if the <a href="CellEdit.htm#CCanEdit">CanEdit</a> attribute is set to '0'.<br />
<b>3</b> - Like <b>2</b>, but it asks before saving the value if the original value contained some Html code.<br />

<!-----------------------------------------------------------------------  EHtml type  ------------------------------------------------->
<a name="TEHtml"></a><a name="EHtml"></a>
<h2>EHtml type (HTML editor) <i>since 15.0</i></h2>

<strong>Included in SpreadSheet component</strong><br />
Html editable as CSS styled text in <b>contentEditable</b> tag.<br />
<i>EHtml type is available since 15.0.</i><br />
EHtml type show in cell any HTML code as is without any change, it preserves also white space and CR/LF.<br />
<i>The HTML code must be fully valid. TreeGrid does not check the HTML code validity, the invalid HTML code can break down the whole grid layout!</i><br />
<strong>Not fully available in Internet Explorer <b>9</b> and older!</strong><br />

<a name="XML"></a>
<h4>HTML code in XML</h4>
To put HTML code into XML, you need to escape the '&lt;' and '&amp;' entities by <b>&amp;lt;</b> and <b>&amp;amp;</b> and if placed to XML attribute value also the '<b>"</b>' must be replaced by <b>&amp;quot;</b><br />
If you include the XML data directly into HTML page, you have to escape the entities twice: '&lt;' by <b>&amp;amp;lt;</b> and '&amp;'&nbsp;by <b>&amp;amp;amp;</b> and '<b>"</b>' by <b>&amp;amp;quot;</b><br />

<a name="Link"></a>
<h4>Anchor links (&lt;a href>)</h4>
<i>Since 15.0</i> clicks to the <b>&lt;a href></b> links in the html code are handled the same as the <a href="CellBasics.htm#CellLink">Link</a> attribute.<br />
The links use the cell <a href="CellBasics.htm#CLinkBase">LinkBase</a> and <a href="CellBasics.htm#CLinkTarget">LinkTarget</a> attributes and can be handled by the <a href="CellBasics.htm#CellLink">Link actions</a>.<br />

<a name="Image"></a>
<h4>Images (&lt;img>)</h4>
Images can be inserted by opening local files by system dialog or by dropping image files to the cell. The can be also copied and pasted via clipoboard.<br />
It is also possible to resize the images by mouse dragging during editing.<br />
For inserting images see <a href="CellImage.htm#Image">Insert image</a>.<br />


<a name="Editor"></a>
<h4>Editing HTML by HTML editor</h4>
The EHtml type is editable by default and it is editable as HTML by (contentEditable) HTML editor. <br />
Also <a href="TypeAuto.htm">Auto</a> type can be edited with the HTML editor if set <a href="TypeAuto.htm#CfgAutoHtml">AutoHtml</a>=<b>1</b>.<br />
<br />
The HTML editor actions add and modify only <b>&lt;span></b> tags for style modifications, <b>&lt;a></b> tags for links, <b>&lt;img></b> tags for images and <b>&lt;br></b> tags for new lines.<br />
The tags are not nested, only &lt;a> tag can contain the &lt;span>, &lt;img> and &lt;br> tags and &lt;span> tag can contain the &lt;br> tags.<br />
On begin editing all tags are made root to not be nested. All tags &lt;b>, &lt;i>, &lt;strong>, &lt;em>, &lt;u>, &lt;strike>, &lt;sup>, &lt;sub> and &lt;font> are converted to &lt;span> tags with appropriate style.
Tags &lt;div> are converted to &lt;span> and separated by one &lt;br>, tags &lt;p> are converted to &lt;span> and separated by two &lt;br>.<br />
<br />
The HTML editor permits these actions:<br />
<b>Enter</b> - Enter key (depending on <a href="CellEdit.htm#CfgAcceptEnters">AcceptEnters</a> settings) creates new line by <b>&lt;br></b> tag.<br />
<b>Bold</b> - both actions <a href="CellStyle.htm#ActionsBoldOn">BoldOn</a> / <a href="CellStyle.htm#ActionsBoldOff">BoldOff</a>
switch selected text or text from cursor between bold and normal. Adds / removes <b>&lt;b></b> tag in the source.<br />
<b>Italic</b> - both actions <a href="CellStyle.htm#ActionsItalicOn">ItalicOn</a> / <a href="CellStyle.htm#ActionsItalicOff">ItalicOff</a>
switch selected text or text from cursor between italic and normal. Adds / removes <b>&lt;i></b> tag in the source.<br />
<b>Underline</b> - both actions <a href="CellStyle.htm#ActionsUnderlineOn">UnderlineOn</a> / <a href="CellStyle.htm#ActionsUnderlineOff">UnderlineOff</a>
switch selected text or text from cursor between underlined and normal. Adds / removes <b>&lt;u></b> tag in the source.<br />
<b>Strike</b> - both actions <a href="CellStyle.htm#ActionsStrikeOn">StrikeOn</a> / <a href="CellStyle.htm#ActionsStrikeOff">StrikeOff</a>
switch selected text or text from cursor between strikeout and normal. Adds / removes <b>&lt;strike></b> tag in the source.<br />
<b>Superscript</b> - action <a href="CellStyle.htm#ActionsVAlignTop">VAlignTop</a>
switches selected text or text from cursor between superscript (small text above) and normal. Adds / removes <b>&lt;sup></b> tag in the source.<br />
<b>Subscript</b> - action <a href="CellStyle.htm#ActionsVAlignBottom">VAlignBottom</a>
switches selected text or text from cursor between subscript (small text below) and normal. Adds / removes <b>&lt;sub></b> tag in the source.<br />
<b>Background color</b> - actions <a href="CellStyle.htm#ActionsSetColor">SetColor</a>, <a href="CellStyle.htm#ActionsChooseColor">ChooseColor</a> and <a href="CellStyle.htm#ActionsNoColor">NoColor</a>
set background color of selected text or text around cursor. Adds / removes <b>&lt;font style='background-color:xxx'></b> tag in the source.<br />
<b>Text color</b> - actions <a href="CellStyle.htm#ActionsSetTextColor">SetTextColor</a>, <a href="CellStyle.htm#ActionsChooseTextColor">ChooseTextColor</a> and <a href="CellStyle.htm#ActionsNoTextColor">NoTextColor</a>
set text color of selected text or text around cursor. Adds / removes <b>&lt;font style='color:xxx'></b> tag in the source.<br />
<b>Text shadow color</b> - actions <a href="CellStyle.htm#ActionsSetTextShadowColor">SetTextShadowColor</a>, <a href="CellStyle.htm#ActionsChooseTextShadowColor">ChooseTextShadowColor</a> and <a href="CellStyle.htm#ActionsNoTextShadowColor">NoTextShadowColor</a>
set shadow color of selected text or text around cursor. Adds / removes <b>&lt;font style='textShadow:0px 0px 5px xxx'></b> tag in the source.<br />
<b>Text size</b> - actions <a href="CellStyle.htm#ActionsSetTextSize">SetTextSize</a>, <a href="CellStyle.htm#ActionsChooseTextSize">ChooseTextSize</a> and <a href="CellStyle.htm#ActionsNoTextSize">NoTextSize</a>
set font size of selected text or text around cursor. Adds / removes <b>&lt;font style='font-size:xxx;line-height:xxx'></b> tag in the source.<br />
<b>Text font</b> - actions <a href="CellStyle.htm#ActionsSetTextFont">SetTextFont</a>, <a href="CellStyle.htm#ActionsChooseTextFont">ChooseTextFont</a> and <a href="CellStyle.htm#ActionsNoTextFont">NoTextFont</a>
set font face of selected text or text around cursor. Adds / removes <b>&lt;font style='font-family:xxx'></b> tag in the source.<br />
<b>Clear style</b> - action <a href="CellStyle.htm#ActionsClearStyle">ClearStyle</a> removes all styles from selected text.<br />
<b>Insert image</b> - action <a href="CellImage.htm#ActionsOpenImage">OpenImage</a>. The image files can be also dropped to the cell, see <a href="CellImage.htm#CfgInsertImg">InsertImg</a> setting.<br />
<b>Copy to clipboard</b> - action <a href="CopyPaste.htm#ActionsCopy">Copy</a> copies selected text to clipboard.<br />
<b>Cut to clipboard</b> - action <a href="CopyPaste.htm#ActionsExclude">Exclude</a> copies selected text to clipboard and deletes it.<br />
<b>Upper case</b> - action <a href="CellEdit.htm#ActionsUpperCase">UpperCase</a> converts selected text to upper case.<br />
<b>Lower case</b> - action <a href="CellEdit.htm#ActionsLowerCase">LowerCase</a> converts selected text to lower case.<br />
<br />
By default the focused and edited cell has preset global background and text colors. 
To always show cell colors instead remove <b>Class</b> and <b>Color</b> from <a href="Cursor.htm#IFocusCell">FocusCell</a> attribute value, e.g. <tt>&lt;Def>&lt;D Name='R' FocusCell='Border'>&lt;/Def></tt>.<br />

<!-- Type -->
<a name="CTypeHtml"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "EHtml"</tt></s>
</div>
To define EHtml type, set column or cell attribute Type to "<b>EHtml</b>".<br />

<!-- EmptyValue -->
<a name="CEmptyValue"></a>
<div class="XML">
   <u>new <b>6.3</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>EmptyValue</h4> <s>[""]</s>
</div>
The HTML string displayed when the value is empty.<br />

<!-- Format -->
<a name="CFormat"></a>
<div class="XML">
   <u>new <b>9.2</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
JSON named array of display values for particular cell values. All other cell values are displayed unchanged.<br />
The items can contain HTML code. The names are case sensitive.<br />
For example if <tt>&lt;C Type="EHtml" Format = '{One:"Red", Two:"Green", Three:"&lt;b>blue&lt;/b>"}'/></tt> and the cell value is Two, it displays Green, if the cell value is Four, it displays Four.<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- EditFormat -->
<a name="CEditFormat"></a>
<div class="XML">
   <u>new <b>9.2</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>EditFormat</h4> <s></s>
</div>
Specifies format for editing - how the text will be modified for edit and the edited value back to data. For Html type is used especially for Defaults dialog to have name/key pairs.<br />
JSON named array of input values for particular cell values. Format must start by '{'. All other cell values are edited unchanged. The items must not contain HTML code. The names are case sensitive.<br />
For example if <tt>&lt;C Type="EHtml" EditFormat = '{1:"one", 2:"two", 3:"three"}'/></tt> and cell has value 2, the value for input will be two. If entered 'three', the cell value will be 3, if entered 'four', the cell value will be 'four'.<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- AutoHtml -->
<a name="CfgAutoHtml"></a>
<div class="XML">
   <u>new <b>15.0</b></u> <b>&lt;Cfg></b> <i>bool</i>
   <h4>AutoHtml</h4> <s>[0]</s>
</div>
If set, the <a href="TypeAuto.htm">Auto</a> type uses <b>EHtml</b> type instead of <a href="TypeText.htm">Lines</a> type for the texts.

<!-----------------------------------------------------------------------  Icon type  ------------------------------------------------->
<a name="TIcon"></a>
<h2>Icon type</h2>

Shows one clickable image inside cell. <i>To show more complex image button use <a href="TypeButton.htm#Button">Button</a> Type.</i><br />
It can also contain a link, use <a href="CellBasics.htm#CLink">Link</a> attribute.<br />
It shows the image as background cell image to speed up rendering. <i>To show &lt;IMG> tag, place the &lt;IMG> into <a href="TypeHtml.htm#Html">Html</a> type cell instead.</i><br />
The <b>Icon</b> type cell <u>cannot</u> show left side <a href="CellSideButton.htm#CIcon">Icon</a>, because it uses the same logic.<br />
The <b>Icon</b> type is <u>not</u> editable by default.<br />
<br />
<i>Since 15.0</i> the Icon type can accept local files dropped to the cell or opened by system open file dialog, 
see <a href="CellImage.htm#Image">Insert image</a>.<br />

<!-- Type -->
<a name="CTypeIcon"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "Icon"</tt></s>
</div>
To define Icon type, set column or cell attribute Type to "<b>Icon</b>".<br />

<!-- value -->
<a name="CellvalueIcon"></a>
<div class="XML">
   <u></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
<b>Cell value</b> contains the image source URL.<br />
The URL can be set also by &lt;C <a href="CellSideButton.htm#CIcon">Icon</a> /> for the whole column.<br />
<i>The URL is relative to actual page URL, <u>not</u> to Grid.css, <u>not</u> to XML data!</i><br />

<!-- Align -->
<a name="CAlign"></a>
<div class="XML">
   <u>new <b>6.0</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Align</h4> <s>["Center"]</s>
</div>
How the image will be aligned. Case insensitive keyword: "<b>Left</b>", "<b>Right</b>", "<b>Center</b>".<br />

<!-- IconSize -->
<a name="CIconSize"></a>
<div class="XML">
   <u>new <b>15.0</b></u> <b>&lt;C> &lt;cell></b> <i>int</i>
   <h4>IconSize</h4> <s>[0]</s>
</div>
How the image will be resized / shrunk according to the cell size.<br />
<b>0</b> - no<br />
<b>1</b> - contain - resize the image to be displayed whole<br />
<b>2</b> - cover - resize the image to cover the whole cell, but preserve aspect ratio<br />
<b>3</b> - fill - resize the image to cover the whole cell regardless on aspect ratio<br />

<!-- OnIconClick -->
<a name="OnIconClick"></a>
<div class="API">
   <u>new <b>6.0</b></u> <b>API event</b> <i>bool</i>
   <h4>OnIconClick</h4>
   <s>(<i>TGrid</i> <b>grid</b>, <i>TRow</i> <b>row</b>, <i>string</i> <b>col</b>, <i>int</i> <b>x</b>, <i>int</i> <b>y</b>)</s>
</div>
Called on click to custom Icon type <b>Icon</b>.<br />
<b>x</b>, <b>y</b> is click position inside the icon.<br />
Return true to suppress the default action.<br />

<!-----------------------------------------------------------------------  Abs type  ------------------------------------------------->
<a name="TAbs"></a>
<h2>Abs type</h2>

Abs type shows one or more HTML elements absolutely positioned inside the cell in layers.<br />
It does not affect row height, it is always overflowed.<br /><br />

The count of displayed tags is unlimited.<br />
The tags are displayed in given order, the next tags overlays the previous.<br />

<!-- Type -->
<a name="CTypeAbs"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "Abs"</tt></s>
</div>
To define Abs type, set column or cell attribute Type to "<b>Abs</b>".<br />

<!-- value -->
<a name="CellvalueAbs"></a>
<div class="XML">
   <u>chg <b>6.0</b> <i>upd <b>7.0</b></i></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
Cell value is first character separated array: |x|y|width|height|html|cls|style|borderheight|x|y|width|height|html|cls|style|borderheight|x|...<br />
<table>
<tr><td style="width:120px;"><b>x</b>, <b>y</b></td><td>position relative to left top cell edge.</td></tr>
<tr><td><b>width</b>, <b>height</b></td><td>size of the tag. They can be void to not overflow the <b>html</b> tag, but the <b>html</b> tag is still overflowed by the final cell size (column width, row height).</td></tr>
<tr><td><b>html</b></td><td>any HTML code displayed on the position</td></tr>
<tr><td><b>cls</b></td><td>CSS class for the tag</td></tr>
<tr><td><b>style</b></td><td>inline style added for the part, e.g. background image</td></tr>
<tr><td><b>borderheight</b></td><td><i>(new 7.0)</i> if set CSS class or style with border or padding, here must be set the height of the padding+border</td></tr>
</table>

Example: <tt>"|0|0|||&lt;div style='background:red;height:100px;'>&lt;/div>||||20|3|50|20|The text"</tt><br />

<!-----------------------------------------------------------------------  List type  ------------------------------------------------->
<a name="TList"></a>
<h2>List type</h2>

List is HTML type to show more values with the same repeated parts for many rows.<br />
It is intended to shorten the input XML, otherwise it can be always replaced by basic <a href="TypeHtml.htm#Html">Html</a> type.<br /><br />

The List type is <u>not</u> editable by default.<br />
If set <tt>CanEdit="1"</tt> for List type, the cell value is edited as it is without any validation.<br />

<!-- Type -->
<a name="CTypeList"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "List"</tt></s>
</div>
To define List type, set column or cell attribute Type to "<b>List</b>".<br />

<!-- value -->
<a name="CellvalueList"></a>
<div class="XML">
   <u></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
The value contains the array of items, separated by the first character.<br />
The values are merged together using <a href="TypeHtml.htm#CFormatList">Format</a>. The result can be any HTML code.<br />

<!-- Format -->
<a name="CFormatList"></a>
<div class="XML">
   <u><i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
Syntax: <tt>|BaseFlags|BasePrefix|BasePostfix|Reserved|ItemPrefix|ItemPostfix|Search|Flags|Replace|Reserved|... |ItemNPrefix|ItemNPostfix|NSearch|NFlags|NReplace|NReserved</tt><br />
'|' is any character not contained in any section to separate section values.<br />
<table>
<tr><td style="width:120px;"><i><b>'BaseFlags'</b></i></td><td>is bit array of main flags</td></tr>
<tr><td><i><b>1</b></i></td><td>does not insert ItemPrefix before the first item and ItemNPostfix after the last item</td></tr>
<tr><td><i><b>2</b></i></td><td>escape HTML code in item value</td></tr>
<tr><td><i><b>'BasePrefix'</b></i></td><td>is HTML code added to the beginning</td></tr>
<tr><td><i><b>'BasePostfix'</b></i></td><td>is HTML code added to the end</td></tr>
<tr><td><i><b>'Reserved'</b></i></td><td>is not used yet</td></tr>
<tr><td><i><b>'ItemPrefix'</b></i></td><td>is HTML code added in front of every item</td></tr>
<tr><td><i><b>'ItemPostfix'</b></i></td><td>is HTML code added after every item</td></tr>
<tr><td><i><b>'Search'</b></i></td><td>is RegExp string to replace it for <i><b>'Replace'</b></i> string, for every item. <i><b>'Flags'</b></i> are flags for RegExp, any of 'g', 'i', 'm'.</td></tr>
<tr><td><i><b>'Reserved'</b></i></td><td>is not used yet</td></tr>
</table><br />

If there are more sequences of ItemPrefix, ItemPostfix, ..., the values are used for items in order. For example if there are three sequences, the first sequence will be used for the first, the fourth and the seventh item, the second sequence for the second, the fifth, ...<br />
Examples:<br />
<div class="L1">
<tt>
<i>Value</i>='|A|B|C|D|E' <i>Format</i>='|0|&lt;|>||[|]' <i>Result</i>='<[A][B][C][D][E]>'<br />
<i>Value</i>='|A|B|C|D|E' <i>Format</i>='|0|xxx|yyy||(|)|[ACE]||*' <i>Result</i>='xxx(*)(B)(*)(D)(*)yyy'<br />
<i>Value=</i>'|A|B|C|D|E' <i>Format</i>='|1|[|]|||,' <i>Result</i>='[A,B,C,D,E]'<br />
<i>Value=</i>'|A|B|C|D|E' <i>Format</i>='|0||||&lt;b style="color:red;">|&lt;/b>|||||&lt;b style="color:green;">|&lt;/b>|||||&lt;b style="color:blue;">|&lt;/b>' <i>Result</i>='<b>ABCDE</b>'<br />
</tt>
</div>
<i>Since 15.0 it is read also from row.</i><br />

<!-----------------------------------------------------------------------  Editable Link type  ------------------------------------------------->
<a name="TLink"></a>
<h2>Editable Link type</h2>

<b>The clicks to Link type are handled the same as in <a href="CellBasics.htm#CLink">Link</a>, see the events and actions at <a href="CellBasics.htm#CellLink">Link attribute</a>.</b><br />
For normal <u>not</u> editable links is better to use <a href="CellBasics.htm#CLink">Link</a> attribute.<br /><br />

The Link type represents editable link as HTML attribute &lt;A HREF>.<br />
<i>It supports editing of the url and text inline in the cell as part of the cell value, unlike the simple <a href="CellBasics.htm#CLink">Link</a> attribute.</i><br />

<!-- Type -->
<a name="CTypeLink"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "Link"</tt></s>
</div>
To define Link type, set column or cell attribute Type to "<b>Link</b>".<br />

<!-- value -->
<a name="CellvalueLink"></a>
<div class="XML">
   <u></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
<b>Cell value</b> contains array of values, first character is separator: |Url|Text|Window<br />
<b><u>Url</u></b> is the link url<br />
<b><u>Text</u></b> is a text to display, if is empty the Url is displayed instead<br />
<b><u>Window</u></b> is browser window name where the link will be opened, for new window set "_blank". If not set, it is used <a href="CellBasics.htm#CLinkTarget">LinkTarget</a><br />

<!-- Format -->
<a name="CFormatLink"></a>
<div class="XML">
   <u><i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
Syntax: |UrlPrefix|UrlPostfix|HtmlPrefix|HtmlPostfix|BaseUrlType<br />
'|' is any character not contained in any section to separate section values.<br />
<i><b>'UrlPrefix'</b></i> is string added before link url<br />
<i><b>'UrlPostfix'</b></i> is string added after link url<br />
<i><b>'HtmlPrefix'</b></i> is html code added before link text<br />
<i><b>'HtmlPostfix'</b></i> is html code added after link text<br />
<i><b>'BaseUrlType'</b></i> is integer type, if <b>BaseUrl</b> (from &lt;Cfg> tag) is added before url, <b>0</b> - no, <b>1</b> - yes<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- EditFormat -->
<a name="CEditFormatLink"></a>
<div class="XML">
   <u><i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>EditFormat</h4> <s>[|0|1]</s>
</div>
Syntax: |line|url|link<br />
'|' is any character not contained in any section to separate section values.<br />
<b><i>'line'</i></b> = <b>0</b> to edit all at one line, <b>1</b> to edit at more lines if needed, <b>2</b> to edit every value (url,text) at one line<br />
<b><i>'url'</i></b> = <b>1</b> to display and edit link url<br />
<b><i>'text'</i></b> = <b>1</b> to display and edit link text<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- BaseUrl -->
<a name="CfgBaseUrl"></a>
<div class="XML">
   <u></u> <b>&lt;Cfg></b> <i>string</i>
   <h4>BaseUrl</h4> <s></s>
</div>
String added before urls in types <b>Img</b> and <b>Link</b>, if their format specifies it.<br />

<!-- Action OnClickLink -->
<a name="ActionsOnClickLink"></a>
<div class="DEL">
   <u>deleted <b>15.0</b></u> <b>&lt;XML event></b> <i>bool</i>
   <h4>OnClickLink</h4>
   <s>(<i>TGrid</i> <b>Grid</b>, <i>TRow</i> <b>Row</b>, <i>string</i> <b>Col</b>, <i>TEvent</i> <b>Event</b>)</s>
</div>
<i>Deprecated since 15.0</i>. Since 15.0 the Link type click is handled the same as <a href="CellBasics.htm#CellLink">Link</a> attribute.<br />
Called as &lt;Actions> or cell event when the link is clicked.<br />
Attach the action or any JavaScript code to the cell to be run on the click, like <tt>&lt;I ... Col1OnClick='alert("changed!")' ... /></tt><br />
Return true to follow the link, false to cancel<br />
<i>If you display alert or confirm message in this dialog, you must set <tt><b>Grids.Alert = 1</b>; alert("...."); <b>Grids.Alert = 0</b>;</tt> otherwise the link will not be followed.</i><br />


<!-----------------------------------------------------------------------  Editable Img type  ------------------------------------------------->
<a name="TImg"></a>
<h2>Editable Img type</h2>

For normal <u>not</u> editable images is better to use <a href="TypeHtml.htm#TIcon">Icon</a> type.<br /><br />

The Img type represents editable image with optional link as HTML attribute <tt>&lt;A HREF>&lt;IMG SRC>&lt;/A></tt>.<br />
<i>It supports editing of the url, size and link, unlike the simple <a href="TypeHtml.htm#TIcon">Icon</a> type.</i><br />
<br />
<i>Since 15.0</i> the Img type can accept local files dropped to the cell or opened by system open file dialog, 
see <a href="CellImage.htm#Image">Insert image</a>.<br />

<!-- Type -->
<a name="CTypeImg"></a>
<div class="XML">
   <u></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "Img"</tt></s>
</div>
To define Img type, set column or cell attribute Type to "<b>Img</b>".<br />

<!-- value -->
<a name="CellvalueImg"></a>
<div class="XML">
   <u></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
Cell value contains array of values, first character is separator: <tt>"|image_URL|width|height|left|top|link_URL|link_window"</tt>,<br />
<table>
<tr><td style="width:120px;"><b>image_URL</b></td><td>URL with picture to display,</td></tr>
<tr><td><b>width</b>, <b>height</b>,</td><td>Size of the image</td></tr>
<tr><td><b>left</b>, <b>top</b></td><td>Position of the image inside its source image, to display only part of the image, must be set with <b>width</b> and <b>height</b>.</td></tr>
<tr><td><b>link_URL</b></td><td>link to page displayed after click to image. The click to link is handled the same as to <a href="CellBasics.htm#CLink">Link</a> attribute.</td></tr>
<tr><td><b>link_window</b></td><td>browser window name (target) where the link will be opened, for new window set "_blank"</td></tr>
</table>
Example: <tt>"|/img/test.gif|100|100|0|200|/test/test.html" or "|/img/test2.gif" or "|/img/test.gif|||||/test/test.html"</tt><br />

<!-- Format -->
<a name="CFormatImg"></a>
<div class="XML">
   <u><i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
Syntax: |UrlPrefix|UrlPostfix|HtmlPrefix|HtmlPostfix|LinkPrefix|LinkPostfix|BaseUrlType<br />
'|' is any character not contained in any section to separate section values.<br />
<i><b>'UrlPrefix'</b></i> is string added before source url<br />
<i><b>'UrlPostfix'</b></i> is string added after source url<br />
<i><b>'HtmlPrefix'</b></i> is html code added before image<br />
<i><b>'HtmlPostfix'</b></i> is html code added after image<br />
<i><b>'LinkPrefix'</b></i> is string added before link url<br />
<i><b>'LinkPostfix'</b></i> is string added after link url<br />
<i><b>'BaseUrlType'</b></i> is integer type, if <b>BaseUrl</b> (from &lt;Cfg> tag) is added before urls, <b>0</b> - no, <b>1</b> - before source, <b>2</b> - before link, <b>3</b> - before both<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- EditFormat -->
<a name="CEditFormatImg"></a>
<div class="XML">
   <u><i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>EditFormat</h4> <s>[|0|1]</s>
</div>
Syntax: |line|src|extents|link<br />
 '|' is any character not contained in any section to separate section values.<br />
<i><b>'line'</b></i> = <b>0</b> to edit all at one line, <b>1</b> to edit at more lines if needed, <b>2</b> to edit every value (src,extents,link) at one line<br />
<i><b>'src'</b></i> = <b>1</b> to display and edit source<br />
<i><b>'extents'</b></i> = <b>1</b> to display and edit extents (left, top, width, height)<br />
<i><b>'link'</b></i> = <b>1</b> to display and edit link<br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- BaseUrl -->
<a name="CfgBaseUrlImg"></a>
<div class="XML">
   <u></u> <b>&lt;Cfg></b> <i>string</i>
   <h4>BaseUrl</h4> <s></s>
</div>
String added before urls in types <b>Img</b> and <b>Link</b>, if their format specifies it.<br /> 


<!-----------------------------------------------------------------------  DropCols type  ------------------------------------------------->
<a name="TDropCols"></a>
<h2>DropCols type</h2>

Special interactive cell to drag column captions or other such values here.<br />
It is used for custom grouping, but it can be used for any other action.<br />
<i>Only for cell in <a href="RowSpace.htm">Space</a> rows.</i><br />

<!-- Type -->
<a name="CTypeDropCols"></a>
<div class="XML">
   <u></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s><tt>Type = "DropCols"</tt></s>
</div>
To define DropCols type, set column or cell attribute Type to "<b>DropCols</b>".<br />

<!-- value -->
<a name="CellvalueDropCols"></a>
<div class="XML">
   <u><i>upd <b>9.2</b></i></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
Cell value contains comma separated array of names.<br />
<i>Since 9.2</i> it can contain any strings, not only column names.<br />

<!-- Format -->
<a name="SpaceCellFormat"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
JSON named array of display values for particular cell values. All other cell values are displayed unchanged.<br />
The items can contain HTML code. The names are case sensitive.<br />
For example if <tt>XXXType="DropCols" XXXFormat = '{One:"Red", Two:"Green", Three:"&lt;b>blue&lt;/b>"}' XXX='Two,Four'/></tt> it displays 'Green Four'.<br />

<!-- MinItemWidth -->
<a name="SpaceCellMinItemWidth"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>MinItemWidth</h4> <s></s>
</div>
Minimal width (in pixels) of every cell tab.<br />
If the cell tab is column name, it uses the column width, but between MinCellWidth / MaxCellWidth<br />

<!-- MaxItemWidth -->
<a name="SpaceCellMaxItemWidth"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>MaxItemWidth</h4> <s></s>
</div>
Maximal width (in pixels) of every cell tab.<br />
If the cell tab is column name, it uses the column width, but between MinCellWidth / MaxCellWidth<br />

<!-- AutoWidth -->
<a name="SpaceCellAutoWidth"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>AutoWidth</h4> <s>[1]</s>
</div>
If and how the item widths will be updated, bit array.
<table>
<tr><td style="width:50px;">&1</td><td>The width will be shrunk if the sum is wider than the cell width.</td></tr>
<tr><td>&2</td><td>The width will be extended if the sum is more narrow than the cell width.</td></tr>
<tr><td>&4</td><td>If the item is column name, the column width will be ignored.</td></tr>
</table>

<!-- CanAdd -->
<a name="SpaceCellCanAdd"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>bool</i>
   <h4>CanAdd</h4> <s>[1]</s>
</div>
If it is possible to drop to this row an item dragged from outside (from another row or columns header).<br />

<!-- CanDelete -->
<a name="SpaceCellCanDelete"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>CanDelete</h4> <s>[1]</s>
</div>
<b>0</b> The item cannot be deleted (does <u>not</u> affect moving to another row, see CanMove).<br />
<b>1</b> Item is deleted if moved outside any row.<br />
<b>2</b> Item is deleted if moved outside any row or to place where it is not accepted.<br /> 

<!-- CanMove -->
<a name="SpaceCellCanMove"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>CanMove</h4> <s>[3]</s>
</div>
<b>0</b> No moving items inside and outside the row (only deleting or copying or adding, if permitted by other attributes)<br />
<b>1</b> It is possible to move the items inside the same row. After such move the item is just placed to another position in the same row. Ignored for <tt>CanCopy=1/3</tt><br />
<div class="L1">If <u>not</u> set in destination row (when moving between rows), it is possible to only add items to the end of the item list.</div>
<b>2</b> It is possible to move the items outside the row (to another row). After such move the item is removed from this source row. Ignored for <tt>CanCopy=2/3</tt><br />
<b>3</b> Both moving inside and outside is permitted.<br />

<!-- CanCopy -->
<a name="SpaceCellCanCopy"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>CanCopy</h4> <s>[0]</s>
</div>
<b>0</b> No copying items inside and outside the row (only deleting or moving or adding, if permitted by other attributes)<br />
<b>1</b> It is possible to copy the items inside the same row. After such copy the item is duplicated to another position in the same row. Only if also Duplicates is permitted.<br />
<b>2</b> It is possible to copy the items outside the row (to another row). After such copy the item remains also in the source row.<br />
<b>3</b> Both copying inside and outside is permitted.<br />

<!-- Duplicates -->
<a name="SpaceCellDuplicates"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>Duplicates</h4> <s>[ ]</s>
</div>
If items with the same names are permitted in this row.<br />
<i>Empty</i> - It permits duplicated column name like <b>1</b>, if the column has set GroupMore; for other items (not column names) it permits duplicates like <b>2</b>.<br />
<b>0</b> - Never.<br />
<b>1</b> - Yes, but not next to the same item.<br />
<b>2</b> - Yes, everywhere.<br />

<!-- Accept -->
<a name="SpaceCellAccept"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string[ ]</i>
   <h4>Accept</h4> <s></s>
</div>
Comma separated list of item names that can be dropped to this row.<br />
If not set, all items can be dropped here.<br />

<!-- Single -->
<a name="SpaceCellSingle"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string[ ]</i>
   <h4>Single</h4> <s></s>
</div>
Comma separated list of DropCols cells in format: rowid1,col1,rowid2,col2,rowid3,...<br />
If set it checks these cells for presence of the dragged value according to the <a href="TypeHtml.htm#SpaceCellSingleType">SingleType</a>.<br />
The Single must <u>not</u> contain actual cell.<br />

<!-- SingleType -->
<a name="SpaceCellSingleType"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>SingleType</h4> <s>[2]</s>
</div>
<b>0</b> - Single ignored<br />
<b>1</b> - A value must be present maximally once in the cells (can be deleted).<br />
<b>2</b> - A value must be present exactly once in the cells.<br />
<b>3</b> - A value must be present minimally once in the cells (can be added).<br />

<!-- Text -->
<a name="SpaceCellText"></a>
<div class="XML">
   <u></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>string</i>
   <h4>Text</h4> <s>["To group by drag columns here"]</s>
</div>
A text displayed on empty area inside cell<br />

<!-- MinTextWidth -->
<a name="SpaceCellMinTextWidth"></a>
<div class="XML">
   <u>new <b>9.2</b></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>int</i>
   <h4>MinTextWidth</h4> <s>[40]</s>
</div>
Minimal width of the Text item part. In pixels<br />

<!-- RelWidth -->
<a name="SpaceCellRelWidth"></a>
<div class="XML">
   <u></u> <b style="width:125px;">&lt;Space> &lt;cell></b> <i>bool</i>
   <h4>RelWidth</h4> <s>[0]</s>
</div>
Set it to 1 to resize the cell to whole rest of the space row<br />

<!-- OnChange -->
<a name="OnChange"></a>
<div class="ACT">
   <u></u> <b>&lt;XML event></b> <i>void</i>
   <h4>OnChange</h4>
   <s>(<i>TGrid</i> <b>Grid</b>, <i>TRow</i> <b>Row</b>, <i>string</i> <b>Col</b>, <i>TEvent</i> <b>Event</b>)</s>
</div>
Called as &lt;Actions> or cell event when cell value is changed.<br />
Attach the action or any JavaScript code to the cell to be run on cell value change, like <tt>&lt;I ... Col1OnChange='alert("changed!")' ... /></tt><br />
The new value can be got by <tt>Get(Row,Col)</tt>.<br />

<!-- OnDropCols -->
<a name="OnDropCols"></a>
<div class="API">
   <u>new <b>9.2</b></u> <b>API event</b> <i>int</i>
   <h4>OnDropCols</h4>
   <s>(<i>TGrid</i> <b>grid</b>, <i>TRow</i> <b>row</b>, <i>string</i> <b>col</b>, <i>string</i> <b>value</b>, <i>TGrid</i> <b>togrid</b>, <i>TRow</i> <b>torow</b>, <i>string</i> <b>tocol</b>, <i>int</i> <b>topos</b>, <i>bool</i> <b>drop</b>)</s>
</div>
Called while dragging some item from DropCols and also on drop this item to some place.<br />
<b>grid</b>, <b>row</b>, <b>col</b> is the source grid and cell.<br />
<b>value</b> is the DropCols item name being dragged.<br />
<b>togrid</b>, <b>torow</b>, <b>tocol</b> is cell under mouse cursor. Now it is not possible to drag to another grid, so the <b>togrid = grid</b>.<br />
<b>topos</b> is actual position where the item will be dropped. Or <b>-1</b> means delete item, <b>-2</b> ignore action.<br />
<b>drop</b> is true when the item is being dropped. The event is called once on the end with <tt>drop = 1</tt>.<br />
Return null to not change anything or new <b>topos</b> value.<br />

<!-----------------------------------------------------------------------  File type  ------------------------------------------------->
<a name="TFile"></a>
<h2>Upload File type</h2>

Type to select file(s) from local disk to upload them to server and / or display them in the cell.<br />
<strong>Not available in Internet Explorer <b>9</b> and older!</strong><br />
<br />
The <b>File</b> Type cell by default shows right side Button="File". If the cell value is not empty, it automatically shows also left side Icon="Clear".<br />
To not show the side button / icon, set the Button/Icon to different button or empty string.<br />
<br />
The <b>File</b> Type cell accepts also files dropped by mouse to the cell if set <a href="CellEdit.htm#CfgDropFiles">DropFiles</a>.<br />
<br />
The files are uploaded to server as standard &lt;input type="file"> value under name "<b>rowid$columnname</b>".<br />
If more files are uploaded for one cell, the next files have names "rowid$colname$index", with index starting 1. Note, the first file is without the index.<br />
On server they are accessible: In ASP.NET in <b>Request.Files</b> collection, in PHP in <b>$_FILES</b>, in JSP by <b>request.getPart()</b> method.<br /> 

<div class="XML">
   <u>new <b>12.0</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Type</h4> <s>["Text"] <tt>Type = "File"</tt></s>
</div>
To define File type, set column or cell attribute Type to "<b>File</b>".<br />

<!-- value -->
<a name="CellvalueFile"></a>
<div class="XML">
   <u>new <b>12.0</b> chg <b>15.0</b></u> <b>&lt;cell></b> <i>string</i>
   <h4>value</h4> <s></s>
</div>
<b>Cell value</b> contains an array of inserted file objects. <i>It is the only cell value in TreeGrid assigned by reference and not by value.</i><br />
To access the actual files for upload by API use row[col] as the file list array like in the standard &lt;input type='file'> files array.<br />
This cell value is uploaded to server separately as files under name.<br />
<i>Before 15.0 the cell value contained the &lt;input type='file'> DOM object, so the files were accessible as row[col].files, since 15.0 they are accessible as row[col].</i><br />

<!-- Format -->
<a name="CFormatFile"></a>
<div class="XML">
   <u>new <b>12.0</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;I> &lt;cell></b> <i>string</i>
   <h4>Format</h4> <s></s>
</div>
Used to display the selected files in the cell.<br />
It can contain any html code with some specific keywords to be replaced by the files attribute.<br />
<table>
<tr><td style="width:60px;"><b>*Name*</b></td><td>File name with extension, but without the full path.</td></tr>
<tr><td><b>*Type*</b></td><td>File type, e.g. "image/gif".</td></tr>
<tr><td><b>*Size*</b></td><td>File size in bytes.</td></tr>
<tr><td><b>*Url*</b></td><td>Url of image or video file to display e.g. in &lt;img> tag or in some tag background. <i>Not available in IE9 and older browsers!</i></td></tr>
<tr><td><b>*Height*</b></td><td>Height of the cell in pixels.</td></tr>
<tr><td><b>*Width*</b></td><td>Width of the cell in pixels.</td></tr>
</table>
For example: <tt>Format="*Name* &amp;lt;img src='*Url*' height='*Height*' width='*Height*'>"</tt><br />
<i>Since 15.0 it is read also from row.</i><br />

<!-- Separator -->
<a name="CSeparator"></a>
<div class="XML">
   <u>new <b>12.0</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Separator</h4> <s></s>
</div>
HTML code that separates individual files defined by <a href="#CFormatFile">Format</a> attribute.<br />
Default value is ValueSeparatorHtml defined in &lt;Lang>&lt;Format> in Text.xml.<br />

<!-- Range -->
<a name="CRange"></a>
<div class="XML">
   <u>new <b>12.0</b> <i>upd <b>15.0</b></i></u> <b>&lt;C> &lt;cell></b> <i>int</i>
   <h4>Range</h4> <s></s>
</div>
If set to <b>1</b>, it permits selecting more files, otherwise only one file.<br />
<i>Since 15.0</i> If set to <b>2</b>, the files are added to the previous files array, to the end.<br />

<!-- Accept -->
<a name="CAccept"></a>
<div class="XML">
   <u>new <b>12.0</b></u> <b>&lt;C> &lt;cell></b> <i>string</i>
   <h4>Accept</h4> <s></s>
</div>
File types that can be selected. The value is the same as &lt;input type='file' <b>accept</b>> attribute.<br />
It can be "audio/*" or "video/*" or "image/*" or any <a href="http://www.iana.org/assignments/media-types/media-types.xhtml" target="_blank">MIME type</a>.<br />

<!-- OnSetFile -->
<a name="OnSetFile"></a>
<div class="API">
   <u>new <b>12.0</b> chg <b>15.0</b></u> <b>API event</b> <i>bool</i>
   <h4>OnSetFile</h4>
   <s>(<i>TGrid</i> <b>grid</b>, <i>TRow</i> <b>row</b>, <i>string</i> <b>col</b>, <i>object[]</i> <b>files</b>)</s>
</div>
Called after the file dialog was closed.<br />
<b>files</b> is array of files to add / insert. It is possible to change the array, especially remove individual items.<br />
<i>Prior to 15.0</i> the <b>files</b> was &lt;input type='file'><br />
Return <b>true</b> to cancel the action, false to continue.
<i>Prior to 15.0</i> the return true cleared the cell, <i>since 15.0</i> clear the cell by setting files.length = 0 and return false.<br />
Here you can restrict choosing some files, e.g. too long files:<br />
<tt>Grids.OnSetFile = function(G,row,col,input){</tt><br />
<tt>for(var i=0;i&lt;input.files.length;i++) if(input.files[i].size>100000){ alert("too large file"); return true; }</tt><br />
<tt>}</tt><br />

<!-- Action ShowFile -->
<a name="ActionsShowFile"></a>
<div class="ACT">
   <u>new <b>12.0</b></u> <b>&lt;Actions></b> <i></i>
   <h4>ShowFile <i>...<a href="Events.htm#Suffix">FAO</a></i></h4>
   <s>Attached to events <b>OnClickSideFile</b>, <b>OnEnter</b>, <b>OnCtrlDown</b></s>
</div>
Shows the system dialog to select one or more files for the cell.<br />

</div>
</body>
</html>
